<html>
<head>
<link rel="stylesheet" type="text/css" href="jquerymobile/jquery.mobile.custom.structure.min.css" />
<link rel="stylesheet" type="text/css" href="jquerymobile/jquery.mobile.custom.theme.min.css">
<link rel="stylesheet" type="text/css" href="index.css"></script>
<script src="jquerymobile/jquery-1.8.2.min.js"></script>
<script src="jquerymobile/jquery.mobile-1.2.0.min.js"></script>
<script src="questionnaire_preparation.js"></script>
<script src="CHANGE_QUESTIONS_HERE.js"></script>
<script src="index.js"></script>
</head>
<body>

<!------------------------------------------------------------------------------------------------------------------------------------
	HTML below this line.
------------------------------------------------------------------------------------------------------------------------------------->
<!-- Login Page -->
<div id="login" data-role="page" data-title="login">
    <div data-role='header' data-position='inline'>
        <h1>Welcome to Homeless Registry App</h1>
    </div>
    
    <div data-role="content">
      <div id="loginForm">
        User Name:<br/>
        <input type="text" id="usernameInputField" autocorrect="off" autocapitalize="off" /><br />
        Password:<br/>
        <input type="password" id="passwordInputField" autocorrect="off" autocapitalize="off"/><br/>    
        <a href="#Instructions" data-role="button"id="loginButton" >Login</a>
      </div>
    </div>
    
    <div id="login_footer" data-role="footer" class="ui-bar" data-position="fixed">
        <div data-role="controlgroup" data-type="horizontal">
            <a href="#help_dialog" data-rel="dialog" data-role="button" data-transition="flip">Help</a>
        </div>
    </div>
</div>

<!-- Instructions Page && Survey ID -->
<div id="Instructions" data-role="page" data-title="instructions">
    <div data-role='header' data-position='inline'>
        <h1>Instructions</h1>
    </div>
    
    <a href="" data-role="button"  data-theme="b" data-inline="true" data-mini="true">Survey ID:123-0 </a>
    
    <div data-role="collapsible-set" data-theme="b" data-content-theme="d">
	<div data-role="collapsible">
		<h2>Terms Of Use</h2>
		<ul data-role="listview" data-theme="d" data-divider-theme="d">
			<li data-role="list-divider">Data Storage <span class="ui-li-count">2</span></li>
			<li>
				<p><strong>term 1</strong></p>
				
				
			</li>
			<li>
				<p><strong>term 2</strong></p>
				
			</li>
		</ul>
	</div>
        <div data-role="collapsible">
		<h2>Interviewing</h2>
		<ul data-role="listview" data-theme="d" data-divider-theme="d">
			<li data-role="list-divider">Data Storage <span class="ui-li-count">2</span></li>
			<li>
				<p><strong>rule 1</strong></p>
				
				
			</li>
			<li>
				<p><strong>rule 2</strong></p>
				
			</li>
		</ul>
	</div>
        <div data-role="collapsible">
		<h2>Data Privacy</h2>
		<ul data-role="listview" data-theme="d" data-divider-theme="d">
			<li data-role="list-divider">Data Storage <span class="ui-li-count">2</span></li>
			<li>
				<p><strong>regulation 1</strong></p>
				
				
			</li>
			<li>
				<p><strong>regulation 2</strong></p>
				
			</li>
		</ul>
	</div>		
    </div>
     
    <a href="#QuestionAnswerPage" data-role="button" data-icon="arrow-r" data-theme="b" data-inline="true" data-mini="true">Continue . . . </a>
    
    <div id="login_footer" data-role="footer" class="ui-bar" data-position="fixed">
        <div data-role="controlgroup" data-type="horizontal">
            <a href="#help_dialog" data-rel="dialog" data-role="button" data-transition="flip">Help</a>
        </div>
    </div>
</div>

<!-- Content Page -->
<div id="QuestionAnswerPage" data-role="page" data-title="question_answer">
    <div data-role='header' data-position='inline'>
        <h1>Q 1</h1>
    </div>
    
    
    
    <div data-role="footer" data-theme="a">
            <a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="left">Previous</a>
            <a href="#submit" data-role="button" data-icon="arrow-r" data-iconpos="left">Next</a>
            <a href="index.html" data-role="button" data-icon="plus" data-iconpos="left">Save</a>
    </div>
</div>

<!-- submit and upload page -->
<div id="submit" data-role="page" data-title="question_answer">
    <div data-role='header' data-position='inline'>
        <h1>Uploading</h1>
    </div>
    
    
    
    <div data-role="footer" data-theme="a">
           <div data-role="controlgroup" data-type="horizontal">
             <a href="#help_dialog" data-rel="dialog" data-role="button" data-transition="flip">Help</a>
             <a href="#home" data-rel="dialog" data-role="button" data-transition="flip">Home</a>
           </div>
    </div>
</div>

<!------------------------------------------------------------------------------------------------------------------------------------
	HTML above this line.
------------------------------------------------------------------------------------------------------------------------------------->

</body>
</html>
